<template>
    <view>
		<view class="mb-12 white round-5 c_yy">
		    <tm-input transprent
			 @click="show=!show"
		    :prefixLabel="_title" 
		    :model-value="_modelStr"
		    :margin="[0, 10]" 
		    :padding="[0, 0]" 
		    :input-padding="[24, 0]"
		    :height="88" :round="5" align="right" 
		    disabled placeholder="请选择">
		        <template v-slot:right>
		            <view class="ml-20">
		                <tm-icon color="#C8C8C8" :font-size="28" name="tmicon-angle-right"></tm-icon>
		            </view>
		        </template>
		    </tm-input>
		</view>
		<tm-picker
		v-model:show="show"
		:columns="_list"
		:default-value="_id"
		v-model="_id"
		v-model:model-str="_modelStr"
		map-key="title"
		selected-model="id"
		@confirm="changeSelected"
		>
		    
		</tm-picker>
	</view>
</template>
<script setup lang="ts">
import { computed,ref } from 'vue';
const show = ref(false)
const emits = defineEmits(["update:id"])
const props = defineProps({
    list:{
        type:Array,
        default:()=>[]
    },
    id:{
        type:[String,Number],
        default:""
    },
    title:{
        type:String,
        default:"标题"
    }
})
const _list = computed(()=>props.list)
const _title = computed(()=>props.title)
const _id = ref([props.id])
const _modelStr = ref("")
function changeSelected(item:any,index:number){
    emits("update:id",_list.value[item[0]].id)
}
</script>